<template>
  <div>
    <Carousel class="carousel-demo1" :datas="params" :height="500" :autoplay="autoplay" :paginationTrigger="paginationTrigger" :arrow="arrow" :pageTheme="pageTheme" :speed="2000" :changeSpeed="1000" :effect="effect">
      <template slot-scope="{carousel}" slot="item">
        <div class="h-carousel-p" :style="`background: ${carousel.color}`">{{carousel.title}}</div>
      </template>下·
    </Carousel>
  </div>
  <div style="background-color: #f3f5fb;width:1280px;margin:0 auto">
    <div style="text-align: center;margin-top: 40px;margin-bottom: 40px"><h2>了解我们的产品/服务</h2><p>全场景业财一体化产品，助力企业数字升级</p></div>
    <div style="margin-bottom: 40px">
      <Row :space="20">
      <Cell width="6">
        <div class="bg-white-color" style="height: 280px;border-radius: 4px;padding: 16px">
          <div style="font-size: 22px;font-weight: bold;border-bottom: 1px solid #ddd;padding-bottom: 16px;margin-bottom: 16px">云财务</div>
          <div style="margin: 16px 0">智能云财务系统</div>
          <div style="line-height: 2;font-size: 14px;color: #727272">高效记账，自定义报表管理、数据安全、让财务管理更智能、更高效、更简单！</div>
        </div>
      </Cell>
      <Cell width="6">
        <div class="bg-white-color" style="height: 280px;border-radius: 4px;padding: 16px">
          <div style="font-size: 22px;font-weight: bold;border-bottom: 1px solid #ddd;padding-bottom: 16px;margin-bottom: 16px">云对账</div>
          <div style="margin: 16px 0">企业级对账解决方案</div>
          <div style="line-height: 2;font-size: 14px;color: #727272">打通“数据采集-对账处理-财务核算”链路，实现企业内部各系统之间数据、企业与外部系统之间数据的自动核对，大幅度减轻财务人员和业务人员的日常工作量。</div>
        </div>
      </Cell>
      <Cell width="6">
        <div class="bg-white-color" style="height: 280px;border-radius: 4px;padding: 16px">
          <div style="font-size: 22px;font-weight: bold;border-bottom: 1px solid #ddd;padding-bottom: 16px;margin-bottom: 16px">云报销</div>
          <div style="margin: 16px 0">对接主流财务软件，实现自动化记账</div>
          <div style="line-height: 2;font-size: 14px;color: #727272">单据一键生成财务凭证,节省财务90%记账时间、对接统一支付平台,批量快捷支付，降低手工操作风险.</div>
        </div>
      </Cell>
      <Cell width="6">
        <div class="bg-white-color" style="height: 280px;border-radius: 4px;padding: 16px">
          <div style="font-size: 22px;font-weight: bold;border-bottom: 1px solid #ddd;padding-bottom: 16px;margin-bottom: 16px">云进销存</div>
          <div style="margin: 16px 0">让成本核算更简单</div>
          <div style="line-height: 2;font-size: 14px;color: #727272">从采购到入库全程跟踪、
            随时掌握采购状况、强大的库存及商品管理、自动报表生成</div>
        </div>
      </Cell>
      <Cell width="6">
        <div class="bg-white-color" style="height: 280px;border-radius: 4px;padding: 16px">
          <div style="font-size: 22px;font-weight: bold;border-bottom: 1px solid #ddd;padding-bottom: 16px;margin-bottom: 16px">ADI业财中间件</div>
          <div style="margin: 16px 0">一键生成凭证</div>
          <div style="line-height: 2;font-size: 14px;color: #727272">对接主流财务软件,灵活生成规则配置，对接钉钉，企业微信,自动生成凭证</div>
        </div>
      </Cell>
      <Cell width="6">
        <div class="bg-white-color" style="height: 280px;border-radius: 4px;padding: 16px">
          <div style="font-size: 22px;font-weight: bold;border-bottom: 1px solid #ddd;padding-bottom: 16px;margin-bottom: 16px">云财务商业版源码</div>
          <div style="margin: 16px 0">云财务商业版源码</div>
          <div style="line-height: 2;font-size: 14px;color: #727272">业内首家开放源代码，可深度集成到业务系统,并持续更新<a href="https://gitee.com/flyemu/public-financial.git">Gitee:地址</a></div>
        </div>
      </Cell>
    </Row>
    </div>
  </div>
</template>

<script>
/**
 * <p>****************************************************************************</p>
 * <p><b>Copyright © 2010-2023 soho team All Rights Reserved<b></p>
 * <ul style="margin:15px;">
 * <li>Description : </li>
 * <li>Version     : 1.0</li>
 * <li>Creation    : 2023年02月12日</li>
 * <li>@author     : ____′↘夏悸</li>
 * </ul>
 * <p>****************************************************************************</p>
 */
export default {
  name: "Index",
  data() {
    return {
      page: 'Page 1',
      params: [
        {
          title: 'Page 1',
          link: true,
          image: '/images/image1.png'
        },
        {
          title: 'Page 2',
          link: 'http://www.baidu.com',
          image: '/images/image2.png'
        },
        {
          title: 'Page 3',
          image: '/images/image3.png'
        },
        {
          title: 'Page 4',
          image: '/images/image4.png'
        }
      ],
      methods: {
        change(index, data) {
          this.page = data.title;
        },
        click(index, data) {
          message(`点击了${data.title}`);
        }
      }
    }
  }
}
</script>

<style>

.h-row>div>div{
  height: 30px;
}
</style>
